<template>
	<SafeBox>
		<view class="">
			<view class="flex-row justify-around header-box">
				<view class="item">
					<button open-type="share" class="label">
						邀请好友
					</button>
				</view>
				<view class="item">
					<button class="label">
						得分记录
					</button>

				</view>
				<view class="item">
					<button class="label">
						语音播报
					</button>
				</view>
			</view>

			<view class="flex-column p_x10 p_y10">
				<MultMemberItem @onInit="e=>getInfo()" class="m_b10" :user-id="userInfo.id" :member="item"
					v-for="(item,i) of members" :key="i" />
			</view>
		</view>
	</SafeBox>
</template>

<script>
	import Table from "@/api/Table.js"
	import Config from "@/vars/Config.js"
	import MultMemberItem from "@/myComponents/memberItem/MultMemberItem.vue"
	import SafeBox from "@/myComponents/box/SafeBox.vue"
	import {
		toast,
	} from "@/utils/helpers.js"
	import {
		mapState
	} from "vuex"
	export default {
		components: {
			SafeBox,
			MultMemberItem,
		},
		data() {
			return {
				id: 0,
				members: [],
				group: [],
			}
		},
		computed: {
			...mapState("user", [
				'userInfo',
			]),

		},
		onLoad(options) {
			this.$store.dispatch("user/getToken");
			this.id = options.id;
			this.getInfo();
		},
		onReachBottom() {
			this.getInfo()
		},
		onPullDownRefresh() {
			this.getInfo()
		},
		async onShareAppMessage(options) {
			const shareObj = {
				title: Config.appName, // 默认是小程序的名称(可以写slogan等)
				path: `/pages/list/join?id=${this.id}`, // 默认是当前页面，必须是以‘/’开头的完整路径
				// 　　　　imageUrl: '',     //自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
			};
			return shareObj
		},
		methods: {
			async getInfo() {
				try {
					const data = await Table.info(this.id)
					this.members = data[1] || data.info || [];
					this.group = data['group'];
					console.log(data)
				} catch (e) {
					toast(e.message)
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.header-box {
		padding: 40rpx 0;
		// margin-bottom: 40rpx;
		background-color: #f9f9f9;

		.item {
			.label {
				color: #666;
				font-size: 24rpx;
			}
		}
	}
</style>
